<!--
 * @Author: your name
 * @Date: 2020-11-10 21:40:45
 * @LastEditTime: 2021-01-25 11:51:29
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \cang-chu-guan-li-xi-tong\src\App.vue
-->
<template>
     <div> 
      <router-view />
    </div>
</template>

<script>
import enquireScreen from "./utils/device";
import { mapState } from "vuex";
import themeUtil from "@/utils/themeUtil";


export default {
  name: "App",
  data() {
    return {
      locale: {},
      lastTime: null, //最后一次点击的时间
      timeOut: 60 * 60 * 1000, //设置超时时间： 60分钟
      timer: "", //设定定时器
    };
  },
  created() {
    let _this = this;
    this.setLanguage(this.lang);
    enquireScreen((isMobile) => {
      _this.$store.commit("setting/setDevice", isMobile);
    });
  },
  mounted() {
    this.setWeekModeTheme(this.weekMode);
    this.$store.dispatch("user/getMenuRights"); // 拿到路由权限
    this.$store.dispatch("user/getButtonRights"); // 拿到按钮权限
  },
  watch: {
    weekMode(val) {
      this.setWeekModeTheme(val);
    },
    lang(val) {
      this.setLanguage(val);
    },
    "theme.mode": function (val) {
      let closeMessage = this.$message.loading(
        `您选择了主题模式 ${val}, 正在切换...`
      );
      themeUtil.changeThemeColor(this.theme.color, val).then(() => {
        setTimeout(closeMessage, 1000);
      });
    },
    "theme.color": function (val) {
      let closeMessage = this.$message.loading(
        `您选择了主题色 ${val}, 正在切换...`
      );
      themeUtil.changeThemeColor(val, this.theme.mode).then(() => {
        setTimeout(closeMessage, 1000);
      });
    },
  },
  computed: {
    ...mapState("setting", ["theme", "weekMode", "lang"]),
  },
  methods: {
    setWeekModeTheme(weekMode) {
      if (weekMode) {
        document.body.classList.add("week-mode");
      } else {
        document.body.classList.remove("week-mode");
      }
    },

    setLanguage(lang) {
      this.$i18n.locale = lang;
      switch (lang) {
        case "CN":
          this.locale = require("ant-design-vue/es/locale-provider/zh_CN").default;
          break;
        case "HK":
          this.locale = require("ant-design-vue/es/locale-provider/zh_TW").default;
          break;
        case "US":
        default:
          this.locale = require("ant-design-vue/es/locale-provider/en_US").default;
          break;
      }
    },
     detectUserBehavior() {
      this.lastTime = new Date().getTime(); //记录用户操作时间
    },

    monitorUserBehavior() {
      let nowtime = new Date().getTime();
      // console.log(nowtime - this.lastTime - this.timeOut);
      if (nowtime - this.lastTime >= this.timeOut) {
        clearInterval(this.timer);
        localStorage.clear();
        this.$router.push("/login");
      }
    },
  },
};
</script>
